import React, { useState, useEffect } from 'react';
import svgCaptcha from 'svg-captcha';

const Captcha = () => {
  const [captcha, setCaptcha] = useState({ text: '', data: '' });

  useEffect(() => {
    generateCaptcha();
  }, []);


  const generateCaptcha = () => {
    const newCaptcha = svgCaptcha.create();
    setCaptcha({ text: newCaptcha.text, data: newCaptcha.data });
  };


  const handleRefresh = () => {
    generateCaptcha();
  };

  return (
    <div>
      <div dangerouslySetInnerHTML={{ __html: captcha.data }} />
      <button onClick={handleRefresh}>刷新验证码</button>
    </div>
  );
};


export default Captcha;
